﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Jquery表格</title>
    <script type="text/javascript" src="js/jquery-1.3.2-vsdoc2.js"></script>
    <script type="text/javascript" src="js/mycommon.js"></script>
    <!--jquery操作表格-->
    <script type="text/javascript">

        function CalculatorMoney(weight, rate) {
            var vResult = 0.0;
            if (rate == 0) {
                return 0.0;
            }

            var vweight = Math.round(parseFloat(weight)); //重量四舍五入

            if (vweight <= 38)//重量小于等于38公斤统一收15块
            {
                vResult = 15;
                return vResult;

            }


            vResult = Math.floor(vweight * parseFloat(rate)); //计算重量*费率,然后去掉小数

            var strResult = vResult.toString(); //转换成字符串

            var strlast = strResult.toString().substring(strResult.length - 1); //费率取尾数

            var intlast = parseInt(strlast); //尾数转换成数字

            if (intlast >= 3 && intlast < 8) //若尾数大于3并且小于8，则收费=(（计费-尾数）/5+1)*5
            {
                vResult = ((vResult - intlast) / 5 + 1) * 5;

            }
            else {
                if (intlast >= 8)//若尾数大于等于8，则收费=（（计费-尾数)/5+2)*5
                {
                    vResult = ((vResult - intlast) / 5 + 2) * 5;
                }
                else {
                    if (intlast < 3)//若尾数小于等于3，则收费=计费-尾数
                    {
                        vResult = vResult - intlast;
                    }
                }

            }
            if (isNaN(vResult))//如果是NaN说明有问题，清空结果
            {
                vResult = "";
            }
            return vResult;
        }

        function getDateBAK() {
            var d, s, t;
            d = new Date();
            s = d.getFullYear().toString(10) + "-";
            t = d.getMonth() + 1;
            s += (t > 9 ? "" : "0") + t + "-";
            t = d.getDate();
            s += (t > 9 ? "" : "0") + t + " ";
            t = d.getHours();
            s += (t > 9 ? "" : "0") + t + ":";
            t = d.getMinutes();
            s += (t > 9 ? "" : "0") + t + ":";
            t = d.getSeconds();
            s += (t > 9 ? "" : "0") + t;
            return s;
        }
        function getDate() {
            var d, t;
            d = new Date();

            t =d.toLocaleDateString()+" "+ d.toLocaleTimeString()+"  "+d.getMilliseconds(); //+.Format("YYYY-MM-DD HH:MM:SS").toString();
            return t;
        }



        function AddRow() {
            var v = $("#tbin"); //得到表格的jquery对象        
            //所有的数据行有一个.MyRow的Class，得到数据行的大小;
            var vcount = $("#tbin tr").filter(".MyRow").size() + 1; //表格有多少个数据行;  
            var vTr = $("#tbin #trDataRow1");
            var vTrClone = vTr.clone(true);
            vTrClone.attr("id", vcount);
            vTrClone.appendTo(v); //把vtr对象添加到表格 
            vTxtId = vTrClone.find("#txtID");  //找到序号文本框对象
            vTxtId.val(vcount); //设置文本框的序号; 

            vtxtCount = vTrClone.find("#txtCount"); //件数
            vtxtCount.val(0);

            vtxtWeight = vTrClone.find("#txtWeight"); //重量
            vtxtWeight.val(0);
            vtxtMoneyWeight = vTrClone.find("#txtMoneyWeight"); //计费重量
            vtxtMoneyWeight.val(0);

            vselReceiver = vTrClone.find("#selReceiver option"); //收货人          
            var vOptionObj = vselReceiver[0]; //jquery对象转换为dom对象
            var vOption = $(vOptionObj);
            vOption.attr("selected", true);

            vTxtReceiver = vTrClone.find("#txtReceiver");
            vTxtReceiver.val("");

            vtxtRate = vTrClone.find("#txtRate");
            vtxtRate.val("");

            vtxtMoney = vTrClone.find("#txtMoney");
            vtxtMoney.val("");


            vtxtDate = vTrClone.find("#txtDate");
            vtxtDate.val(getDate());
            vtxtDate.attr("readonly", "true");

            vNumber = vTrClone.find("#txtNumber");
            vNumber.val("");

            vDivMessage = vTrClone.find("#divMessage");
            vDivMessage.html("");

            vSpecialText = vTrClone.find("#txtSpecial_Remark");
            vSpecialText.val("");

            var domvNumber = vNumber[0]; //jquery对象转换为dom对象
            domvNumber.focus();

        }



        function UpdateTotal()//更新总金额
        {
            var vTotalMoney = 0; //总金额的初始值为0;               
            var vTable = $("#tbin"); //得到表格的jquery对象    
            var vTotal = vTable.find("#txtTotal"); //得到总金额对象
            var vtxtAfters = vTable.find("#txtMoney"); //得到所有的费用对象;
            vtxtAfters.each(
            function (i) {
                var vTempValue = $(this).val();
                if (vTempValue == "") {
                    vTempValue = 0;
                }
                vTotalMoney = vTotalMoney + parseFloat(vTempValue);
            }
        )//遍历结束
            vTotal.val(vTotalMoney);
        }

        function MyKeyDown() {
            switch (event.keyCode) {
                case 13:    //回车键
                    event.keyCode = '9';
                    break;
                case 37:  //左箭头 shift+tab                       
                    var vcurrent = $(this); // 当前对象  
                    var vid = vcurrent.attr("id");
                    if (vid == "txtNumber") {
                        return;
                    }
                    else
                        var vMy = vcurrent.parent().prev().find(":first-child");
                    {
                        var vSel = vMy[0];
                        vSel.focus();
                        break;
                    }
                case 38: //上箭头  
                    var vcurrent = $(this); // 当前对象 
                    var vid = vcurrent.attr("id");
                    var vTr = vcurrent.parent("td").parent("tr"); //得到父tr对象;  
                    var vTrSel = vTr.prev();
                    if (vid != "selReceiver" && vTrSel != null && vTrSel.attr("id") != "trHead") {

                        var vText = "#" + vid;
                        var vTxt = vTrSel.find(vText);
                        if (vTxt != null) {
                            var vSel = vTxt[0];
                            vSel.focus();
                        }
                    }
                    break;
                case 39:
                    event.keyCode = '9';
                    //右箭头
                    break;
                case 40: //下箭头
                    var vcurrent = $(this); // 当前对象 
                    var vid = vcurrent.attr("id");
                    var vTr = vcurrent.parent("td").parent("tr"); //得到父tr对象;  
                    var vTrSel = vTr.next();
                    if (vid != "selReceiver" && vTrSel != null && vTrSel.html() != null) {

                        var vText = "#" + vid;
                        var vTxt = vTrSel.find(vText);
                        if (vTxt != null) {
                            var vSel = vTxt[0];
                            vSel.focus();
                        }
                    }

                    break;
            }


        }
    </script>
    <!--表格操作js结束-->
    <style type="text/css">
        .buttonwhite_60_23
        {
            background-image: url(Images/buttonwhite_60_23.gif );
            cursor: hand;
            height: 23px;
            width: 60px;
            border: 0px solid black;
            font-size: 12px;
            color: #313031;
            font-family: 宋体;
            padding-top: 2px;
        }
        .inputText
        {
            border-width: thin;
            border-color: silver;
            color: #0f619d;
            font-size: 13px;
            height: 20px;
            border-bottom-width: 1px;
            border-left-width: 1px;
            border-right-width: 1px;
            border-top-width: 1px;
            border-style: solid;
            background-color: transparent;
            text-align:left;
        }
        .inputLeft
        {
            border-width: thin;
            border-color: silver;
            color: #0f619d;
            font-size: 13px;
            height: 20px;
            border-bottom-width: 1px;
            border-left-width: 1px;
            border-right-width: 1px;
            border-top-width: 1px;
            border-style: solid;
            background-color: transparent;
        }
        .HeadStyle
        {
            background-color: #0f619d;
            color: #FFFFFF;
            font-weight: bold;
            font-size: 15px;
            height: 25px;
            text-align: center;
            border-color: #CFDCEF;
            border-bottom-width: 1px;
            border-left-width: 1px;
            border-right-width: 1px;
            border-top-width: 1px;
            border-style: solid;
        }
        .RowStyle
        {
            background-color: #f8fbfc;
            color: #2D6FA9;
            font-weight: normal;
            font-size: 12px;
            height: 20px;
            text-align: Left;
        }
        .MyRow
        {
            background-color: #f8fbfc;
            color: #2D6FA9;
            font-weight: normal;
            font-size: 12px;
            height: 20px;
            text-align: Left;
        }
        .tableRow
        {
            border-color: #CFDCEF;
            border-bottom-width: 1px;
            border-left-width: 1px;
            border-right-width: 1px;
            border-top-width: 1px;
            border-style: solid;
            border-width: 1px;
        }
    </style>
</head>
<body>
    <center>
        <table id="Table2" border="0" cellpadding="0" cellspacing="0">
            <tr align="center">
                <td id="Td1" colspan="10" class="headTitle">
                    XXX公司货运表<br />
                    <br />
                </td>
            </tr>
        </table>
        <table cellpadding="0" cellspacing="0" border="0" id="TABLE1" width="98%">
            <tr>
                <td>
                    <table id="tbin" border="1" bordercolor="#CBDFF2" style="border-collapse: collapse"
                        width="100%" class="tableRow">
                        <!--表头开始-->
                        <tr id="trHead" class="HeadStyle">
                            <td align="center">
                                序号
                            </td>
                            <td align="center">
                                录入时间
                            </td>
                            <td align="center">
                                单号
                            </td>
                            <td align="center">
                                件数
                            </td>
                            <td align="center">
                                重量
                            </td>
                            <td align="center">
                                计费重量
                            </td>
                            <td align="center">
                                收货人
                            </td>
                            <td align="center">
                                费率
                            </td>
                            <td align="center">
                                费用
                            </td>
                            <td align="center">
                                说明(备注)
                            </td>
                            <td align="left">
                                操作
                            </td>
                        </tr>
                        <!--表头结束-->
                        <!--第一行数据-->
                        <tr id="trDataRow1" class="MyRow">
                            <td id="tc1" align="center">
                                <input name="txtID" type="text" value="1" id="txtID" style="width: 20px;" class="inputText" />
                            </td>
                            <td id="tc2" align="center">
                                <input name="txtDate" type="text" id="txtDate" style="width:80%;" class="inputText" />
                            </td>
                            <td id="tc3" align="center">
                                <input name="txtNumber" type="text" id="txtNumber" style="width: 80px;" maxlength="8"
                                    class="inputLeft" />
                                <div id="divMessage" style="color: red">
                                </div>
                            </td>
                            <td id="tc4" align="center">
                                <input name="txtCount" type="text" id="txtCount" style="width: 70px;" maxlength="10"
                                    value="0" class="inputText" />
                            </td>
                            <td id="tc5" align="center">
                                <input name="txtWeight" type="text" value="0" id="txtWeight" style="width: 70px;"
                                    maxlength="10" class="inputText" />
                            </td>
                            <td id="tc6" align="center">
                                <input name="txtMoneyWeight" type="text" value="0" id="txtMoneyWeight" style="width: 70px;"
                                    maxlength="10" class="inputText" />
                            </td>
                            <td id="tc7" align="center">
                                <input name="txtReceiver" type="text" id="txtReceiver" style="width: 60px;" class="inputLeft" />
                                <!--收货人-->
                            </td>
                            <td id="td8" align="center">
                                <input name="txtRate" type="text" id="txtRate" style="width: 70px;" maxlength="10"
                                    class="inputText" />
                                <!--费率-->
                            </td>
                            <td id="td9" align="center">
                                <input name="txtMoney" type="text" id="txtMoney" style="width: 70px;" class="inputText" />
                                <!--费用-->
                            </td>
                            <td id="td10" align="center">
                                <input name="txtSpecial_Remark" type="text" id="txtSpecial_Remark" style="width: 90px;"
                                    class="inputText" />
                                <!--费用-->
                            </td>
                            <td id="tcDel" align="center">
                                <input type="button" name="btnDel" value="删除" id="btnDel" class="buttonwhite_60_23" />
                            </td>
                        </tr>
                        <!--第一行数据结束-->
                        <!--统计行开始-->
                        <tfoot id="trDataRow52">
                            <tr>
                                <td align="right" colspan="8">
                                    总计:
                                </td>
                                <td>
                                    <input name="txtTotal" type="text" value="0" id="txtTotal" style="width: 80px;" class="inputText" />
                                </td>
                                <td colspan="2"></td>
                            </tr>
                        </tfoot>
                        <!--统计行结束-->
                    </table>
                </td>
            </tr>
            <tr>
                <td>
                    <input type="button" name="btnAdd" value="增加明细" accesskey="a" id="btnAdd" class="buttonwhite_60_23" />
                    <font color="red">增加快捷键:alt+a</font> &nbsp;
                </td>
            </tr>
        </table>
    </center>
    <script type="text/javascript">

        $(function () {
            var v = $("#tbin"); //得到表格的jquery对象  
            vtxtDate = v.find("#txtDate");
            vtxtDate.val(getDate());
            vtxtDate.attr("readonly", "true");

            vtxtMoney = v.find("#txtMoney");
            vtxtMoney.attr("readonly", "true");
            vNumber = v.find("#txtNumber");
            var domvNumber = vNumber[0]; //jquery对象转换为dom对象
            domvNumber.focus();

            $("#btnAdd").bind("click", AddRow); //给添加按钮注册js脚本,添加一行       



            $("#txtNumber").bind("keydown", MyKeyDown);  //按下键盘事件
            $("#txtCount").bind("keydown", MyKeyDown);
            $("#txtWeight").bind("keydown", MyKeyDown);
            $("#txtMoneyWeight").bind("keydown", MyKeyDown);  //按下键盘事件
            $("#txtReceiver").bind("keydown", MyKeyDown);
            $("#txtRate").bind("keydown", MyKeyDown);
            $("#txtMoney").bind("keydown", MyKeyDown);
            $("#selReceiver").bind("keydown", MyKeyDown);
            $("#txtSpecial_Remark").bind("keydown", MyKeyDown);






            //每行的删除操作注册脚本事件
            $("#btnDel").bind("click", function () {
                if (confirm('确认要删除么?') == true) {

                    var vcount = $("#tbin tr").filter(".MyRow").size() + 1; //表格有多少个数据行;
                    if (vcount <= 2) {
                        alert('请至少保留一行');
                        return;
                    }
                    var vbtnDel = $(this); //得到点击的按钮对象            
                    var vTr = vbtnDel.parent("td").parent("tr"); //得到父tr对象;               
                    if (vTr.attr("id") == "trDataRow1") {
                        alert('第一行不能删除!'); //第一行是克隆的基础，不能删除
                        return;
                    }
                    else {
                        vTr.remove();
                    }
                    UpdateTotal();
                }


            }); //给删除按钮注册js脚本









            $("#txtID").bind("change", function () {
                var vtxtID = $(this); //得到变化的文本框对象     
                var vVal = vtxtID.val();
                if (vVal == "") {
                    alert('序号不能为空');
                    vtxtID.focus();
                    vtxtID.val(1);
                    return false;
                }
                var vBool = IsInt(vVal, "+");
                if (vBool == false) {
                    alert('序号必须为正整数');
                    vtxtID.focus();
                    vtxtID.val(1);
                    return false;
                }
            }
        )

            //非空判断开始
            $("#txtNumber").bind("change", function () {
                var vtxtID = $(this); //得到变化的文本框对象     
                var vVal = vtxtID.val();
                if (vVal == "") {
                    alert('单号不能为空');
                    vtxtID.focus();
                    return false;
                }
                if (vVal.length != 8) {
                    alert('单号必须为8位数');
                    vtxtID.focus();
                    return false;
                }

            }
        )

            //特殊单号操作
            $("#txtNumber").bind("blur", function () {
                var vtxtID = $(this); //得到变化的文本框对象     
                var vVal = vtxtID.val();

                $.get("ajax/judgeByNumber.aspx?param=" + vVal, function (data) {
                    // alert(data);
                    var vMessage = vtxtID.next();
                    if (data.indexOf("该单号入库单已经录入") != -1) {
                        vMessage.show();
                        vMessage.html("该单号入库单已经录入");
                    }
                    else {
                        vMessage.html("");
                        vMessage.hide("该单号入库单已经录入");
                    }
                });

            }
        )


            //收款信息的非空判断结束       


            $("#txtCount").bind("change", function () {
                var vtxtID = $(this); //得到变化的文本框对象     
                var vVal = vtxtID.val();
                if (vVal == "") {
                    alert('件数不能为空');
                    vtxtID.focus();
                    return false;
                }

                var vBool = IsInt(vVal, "+", "0");
                if (vBool == false) {
                    alert('件数必须为正整数');
                    vtxtID.focus();
                    vtxtID.val(0);
                    return false;
                }
            }
        )
            $("#txtWeight").bind("change", function () {
                var vtxtID = $(this); //得到变化的文本框对象     
                var vVal = vtxtID.val();
                if (vVal == "") {
                    alert('重量不能为空');
                    vtxtID.focus();
                    vtxtID.val(0);
                    return false;
                }
                var vBool = IsInt(vVal, "+", "0");
                if (vBool == false) {
                    alert('重量必须为整数');
                    vtxtID.focus();
                    vtxtID.val(0);
                    return false;
                }
            }
        )


            //计费重量变化时计算费用
            $("#txtMoneyWeight").bind("change", function () {
                var vTotalMoney = 0; //总金额的初始值为0;

                var vtxtDetail = $(this); //得到变化的文本框对象     
                var vVal = vtxtDetail.val();
                if (vVal == "") {
                    alert('计费重量不能为空');
                    vtxtDetail.focus();
                    vtxtDetail.val(0);
                    return false;
                }
                var vBool = IsInt(vVal, "+", "0"); //数据类型判断
                if (vBool == false) {
                    alert('计费重量必须为整数');
                    vtxtDetail.focus();
                    vtxtDetail.val(0);
                    return false;
                }
                var vtxtAfter = vtxtDetail.parent("td").parent("tr").find("#txtRate"); //得到费率;

                var vtxtMoney = vtxtDetail.parent("td").parent("tr").find("#txtMoney"); //得到费用;   
                var vMoney = CalculatorMoney(vVal, vtxtAfter.val());
                vtxtMoney.val(vMoney);
                UpdateTotal();

            }); //变化脚本结束

            //费率变化时计算费用
            $("#txtRate").bind("change", function () {
                var vTotalMoney = 0; //总金额的初始值为0;

                var vtxtDetail = $(this); //得到变化的文本框对象     
                var vVal = vtxtDetail.val();
                if (vVal == "") {
                    alert('费率不能为空');
                    vtxtDetail.focus();
                    vtxtDetail.val(0);
                    return false;
                }
                var vBool = IsFloat(vVal, "+", "0"); //数据类型判断
                if (vBool == false) {
                    alert('费率必须为数字');
                    vtxtDetail.focus();
                    vtxtDetail.val(0);
                    return false;
                }
                var vtxtAfter = vtxtDetail.parent("td").parent("tr").find("#txtMoneyWeight"); //得到计费重量;  
                var vtxtMoney = vtxtDetail.parent("td").parent("tr").find("#txtMoney"); //得到费用;   
                var vMoney = CalculatorMoney(vtxtAfter.val(), vVal);
                vtxtMoney.val(vMoney);
                UpdateTotal();

            }); //变化脚本结束

        })//所有事件脚本结束  
    </script>
</body>
</html>
